<template>
	<view v-if="userInfo" class="content" :style="{ height: `${safeArea.bottom}px`, width: `${safeArea.right - 500}px` }">
		<navbar @loginout="loginOut" :userInfo="userInfo"></navbar>
		<view class="down_area">
			<view class="down_left">
				<SidebarMenu :module="module" @selecMenu="selecMenu" :ownership="ownership"></SidebarMenu>
			</view>

			<view class="down_right">
				<component :is="currentComponent" :ownership="ownership"></component>
			</view>
		</view>

		<footbar></footbar>
	</view>
</template>

<script>

const CloudDB = uniCloud.importObject('getDb');
import { store, mutations } from '@/uni_modules/uni-id-pages/common/store.js';
import navbar from '@/components/navbar.vue';
import footbar from '@/components/footbar.vue';
import SidebarMenu from '@/components/SidebarMenu.vue';
import { shallowRef } from 'vue';
import componentMap from '../../untils/componentMap';
import {userMainStore} from'@/store/mainStore.js'
const mainStore=userMainStore()

export default {
	components: {
		navbar,
		footbar,
		SidebarMenu
	},

	data() {
		return {
			menuIndex: -1,
			module: '',
			safeArea: {},
			contentHeight: 0,
			adminclick: 0,
			currentComponent: shallowRef(null),
			ownership: []
		};
	},

	computed: {
		userInfo() {
			return store.userInfo;
		}
	},
	async mounted() {
		uni.getSystemInfo({
			success(res) {
				this.safeArea = res;
				this.contentHeight = res.screenHeight - 700;
			}
		});
		uni.$on('open', (res) => {
			console.log(res);
			this.selecMenu(res);
		});
	},
	beforeMount() {
		
		uni.$off('open');
	},

	async onLoad(res) {
	
		if (res?.module) {
			this.module = res.module;
			console.log('1', this.module);
		}
		await this.getOwnership();
	},

	methods: {
		async getOwnership() {
			try {
				const res = await CloudDB.getOwnership(this.userInfo._id, this.module);
		
				if (res.code) {
					this.ownership = res.data;
					mainStore.setMainObject({id:res.data[0].code,type:this.module}) 
						
					import(/* @vite-ignore */ '@/components/wms/display.vue').then((res)=>{
						this.currentComponent=res.default
					})
				} else {
					uni.showModal({
						title: '权限获取失败',
						components: res.errMsg
					});
				}
			} catch (e) {
				uni.showModal({
					title: '权限获取失败',
					components: e
				});
			}
		},

		selecMenu(name) {
			const key = `${this.module}/${name}`;
			const loader = componentMap[key];
			if(!loader){
				return
			}
			loader()
				.then((res) => {
					this.currentComponent = res.default;
			
				})
				.catch(() => {
					import(/* @vite-ignore */ '@/components/empty.vue')
						.then((res) => {
							this.currentComponent = res.default;
						})
						.catch(() => {
							/* @vite-ignore */
						});
				});
		},

		handleUserInfo() {
			uni.navigateTo({
				url: '/uni_modules/uni-id-pages/pages/userinfo/userinfo'
			});
		},
		admin() {
			this.adminclick++;
			if (this.adminclick === 5) {
				uni.navigateTo({
					url: '/uni_modules/uni-id-pages/pages/register/register-admin'
				});
			}
		},
		handlemap() {
			uni.navigateTo({
				url: '/pages/map/map'
			});
		},
		loginOut() {
			uni.showModal({
				title: '确认退出',
				success(res) {
					if (res.confirm) {
						mutations.logout();
					}
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.content {
	display: flex;
	flex-direction: column;
	margin-top: 165rpx;
	align-items: center;
	justify-content: center;
}
.up_area {
	width: 100%;
	display: flex;
	height: 200rpx;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	border-bottom: 1px solid #e5e7eb; /* 宽度、样式、颜色 */
	padding-bottom: 10px;
}

.boot_area {
	position: fixed;
	left: 0;
	width: 100vw;
	background-color: #aaaa00;
	bottom: 0;
	height: 100rpx;
}
.down_area {
	display: flex;
	width: 100%;
	height: auto; /* 确保内容撑开容器 */
}
.down_left {
	width: 15%;
	position: fixed;
	top: 165rpx;
	left: 0;
}

.down_right {
	margin-left: 15%;
	flex: 1;
	display: flex;
}

.text-area {
	display: flex;
	justify-content: center;
}

.title {
	font-size: 36rpx;
	color: #8f8f94;
}
</style>
